<template>
	<div>
		<SuperTable
	    	ref="table"
	    	path="API_APP_COUPON_CODE_LISTS"
	    	:columns="columns"
	    	:params="params"
	    	:loading="true"
	    >
	    	<Button type="primary" icon="ios-download-outline" slot="header-left">导出数据</Button>
	    	<Form slot="header-right" :mode="filterForm" inline @submit.native.prevent>
	    		<FormItem label="类型">
	    			<Select v-model="filterForm.type" style="width: 120px">
	    				<Option v-for="item in types" :value="item.value" :key="item.value">{{ item.label }}</Option>
	    			</Select>
	    		</FormItem>
                <FormItem label="状态">
                	<Select v-model="filterForm.status" style="width: 120px">
	    				<Option :value="-1">全部</Option>
	    				<Option :value="1">已启用</Option>
	    				<Option :value="0">未启用</Option>
	    			</Select>
                </FormItem>
                <FormItem label="关键词">
                    <Input v-model="filterForm.keyword" placeholder="请输入关键词搜索" suffix="ios-search" clearable style="width: 240px"></Input>
                </FormItem>
                <Button type="primary" @click="handleSearch">筛选</Button>
	    	</Form>
	        <div slot-scope="{ row }" slot="action">
	        	<iSwitch size="large">
	        		<span slot="open">解锁</span>
        			<span slot="close">锁定</span>
	        	</iSwitch>
	        </div>
	    </SuperTable>
	</div>
</template>

<script>
import Util from '@/libs/util.js';
import SuperTable from '@/components/SuperTable.vue';
export default {
	name: 'memberGroup',
	components: {
		SuperTable
	},
	data() {
		return {
			params: {
				
			},
			columns: [
                {
                    title: '优惠券编号',
                    key: 'name'
                },
                {
                    title: '领取人',
                    key: 'type_text'
                },
                {
                    title: '领取时间',
                    key: 'amount_limit',
                    render: (h, params) => {
                    	if(params.row.amount_limit == 0) {
                    		return h('span', '无门槛');
                    	}
                    	return h('ui-price', params.row.amount_limit);
                    }
                },
                {
                    title: '使用时间',
                    key: 'number',
                    render: (h, params) => {
                    	return h('span', params.row.grant +'/'+ params.row.total);
                    }
                },
                {
                    title: '相关订单',
                    key: 'use'
                },
                {
                    title: '使用状态',
                    key: 'discount_text'
                },
                {
                    title: '是否锁定',
                    slot: 'action'
                },
			],
			types: [
				{label: '全部', value: '0'},
				{label: '全场通用', value: '1'},
				{label: '品牌优惠券', value: '2'},
				{label: '分类优惠券', value: '3'},
				{label: '单品优惠券', value: '4'}
			],
			filterForm: {
				keyword: '',
				type: '0',
				status: -1
			},
		}
	},
	mounted() {
		if(!this.$route.query.id) {
			this.$Message.error({
				content: '获取优惠券参数错误',
				onClose: () => {
					this.$router.back();
				}
			});
		}else{
			this.params.id = this.$route.query.id;
		}
	},
	methods: {
		// 搜索
		handleSearch() {
			let form = this.filterForm;
			this.params.page = 1;
			this.params.keyword = form.keyword;
			this.params.type = form.type;
			this.params.status = form.status == -1 ? null : form.status;
		},
		// 编辑
		handleGoEdit(query) {
			this.$router.push({name: 'app_market_coupon_edit', query});
		},
		// 删除
		handleDelete(id) {
			
		},
		// 查看券码
		handleGoCode(id) {
			this.$router.push({name: 'app_market_coupon_code', query: {id: id}});
		},
		// 发放设置
		handleGoSet(id) {
			this.$router.push({name: 'app_market_coupon_set', query: {id: id}});
		},
	}
}
</script>